<template>
  <div>
    <div class="register_con">
      <div class="l_con fl">
        <a class="reg_logo" href="#/home"><img src="../assets/images/logo02.png"></a>
        <div class="reg_slogan">足不出户 · 新鲜每一天</div>
        <div class="reg_banner"></div>
      </div>

      <div class="r_con fr">
        <div class="reg_title clearfix">
          <h1>用户注册</h1>
          <a href="#/login">登录</a>
        </div>
        <div class="reg_form clearfix">
          <form>
            <ul>
              <li>
                <label>用户名:</label>
                <input type="text" v-model="user.username">
                <span class="error_tip">提示信息</span>
              </li>
              <li>
                <label>昵称:</label>
                <input type="text" v-model="user.nickname">
                <span class="error_tip">提示信息</span>
              </li>
              <li>
                <label>密码:</label>
                <input type="password" v-model="user.password">
                <span class="error_tip">提示信息</span>
              </li>
              <li>
                <label>确认密码:</label>
                <input type="password">
                <span class="error_tip">提示信息</span>
              </li>
              <li>
                <label>邮箱:</label>
                <input type="text" v-model="user.email">
                <!-- <el-button type="primary" @click="email()">发送验证码</el-button>
                <span class="error_tip">提示信息</span> -->
              </li>
              <li>
                <!-- <label>邮箱:</label>
                <input type="text" v-model="user.email"> -->
                <el-button type="primary" @click="email()" class="btn">发送验证码</el-button>
                <span class="error_tip">提示信息</span>
              </li>
              <li>
                <label>验证码:</label>
                <input type="text" v-model="code">
                <span class="error_tip">提示信息</span>
              </li>
              <li>
                <label>电话:</label>
                <input type="text" v-model="user.phone">
                <span class="error_tip">提示信息</span>
              </li>
              <li>
                <label>地址:</label>
                <input type="text" v-model="user.address">
                <span class="error_tip">提示信息</span>
              </li>
              <li class="agreement">
                <input type="checkbox" name="allow" id="allow" checked="checked">
                <label>同意”天天生鲜用户使用协议“</label>
                <span class="error_tip2">提示信息</span>
              </li>
              <li class="reg_sub">
                <input type="submit" value="注 册" @click="register">
              </li>
            </ul>
          </form>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import { getCodeApi } from '../api/GetCode';
import { registerApi } from '../api/GetCode'
export default {
  name: "Register",
  data() {
    return {
      code: "",
      user: {
        username: "",
        password: "",
        phone: "",
        address: "",
        email: "",
        nickname: ""
      }
    }
  },
  methods: {
    email() {
      getCodeApi({ "email": this.user.email });
    },
    register() {
      console.count(this.user);
      registerApi({
        "user": this.user,
        "code": this.code
      }).then(resp => {
        if (resp.msg == "success") {
          this.$router.push({
            path: '/login'
          })
        }
      });
    }

  },
  created() {
    this.$parent.ifShow = false
  }
}
</script>

<style scoped>
.btn{
  margin-left: 249px
}
</style>